<!--
 * @Author: chenxuan
 * @Date: 2021-09-06 09:01:22
 * @LastEditTime: 2023-07-19 13:46:03
 * @LastEditors: chenxuan
-->
<!DOCTYPE html>
<html lang="">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link rel="icon" href="./static/favicon.ico">
    <title>Kibana</title>
	<style>
		 html {
            font-family: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
        }

        body {
            padding: 0;
            margin: 0;
            background-color: #f2f2f2;
        }
        .loading-container{
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            height: 100vh;
        }
        .loading .graph{
            position: relative;
            display: flex;
            justify-content: center;
            align-items: center;
        }
        .loading .graph .effect{
            box-sizing: border-box;
            width: 54px;
            height: 54px;
            border-radius: 50%;
            display: inline-block;
            border-top: 3px solid #028fda;
            border-right: 3px solid rgb(238,238,238);
            animation: rotation 1s linear infinite;
        }
        .loading .graph .logo{
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            width: 38px;
            height: 38px;
            border-radius: 50%;
        }
        .loading .text{
            margin-top: 12px;
            font-weight: 400;
            color: #028fda;
        }

        @keyframes rotation {
          0% {
            transform: rotate(0deg);
          }

          100% {
            transform: rotate(360deg);
          }
        }
	</style>
  </head>
  <body>
    <div id="app">
          <div class="loading-container">
              <div class="loading">
                <div class="graph">
                <div class="effect"></div>
                <img class="logo" src="" alt="">
                </div>
                <div class="text">正在努力加载</div>
              </div>
          </div>
    </div>
  </body>
</html>
